<template>
	<view class="page">
		<view class="content_top">
			<view class="back" @click="toback"> <uni-icons type="back" size="30" color="#fff"></uni-icons> </view>
			<image class="logo" :src="`${store.state.baseImgUrl}static/indexpage/yxcyg.png`"></image>
		</view>

		<view class="content2">
			<view class="datalist">
				<!-- <image src="/static/indexpage/yxcontent.png" mode=""></image> -->
				<scroll-view class="scrollView"	 scroll-x="true">
					<view class="imglist">
							<view class="img" v-for="item in imglist">
								<image :src="item.img" mode="widthFix">111</image>
							</view>		
					</view>
				</scroll-view>

			</view>
			<view class="moreimg">
				<image :src="`${store.state.baseImgUrl}static/main/yxmore.png`" mode=""></image>
				<text>更多</text>
			</view>
		</view>
	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue';
import { useStore } from 'vuex';
	const store = useStore()
const imglist=ref([
	{img:`${store.state.baseImgUrl}static/indexpage/gdjs_01.png`},
	{img:`${store.state.baseImgUrl}static/indexpage/gdyx_02.png`},
	{img:`${store.state.baseImgUrl}static/indexpage/gdjs_01.png`},
	{img:`${store.state.baseImgUrl}static/indexpage/gdyx_02.png`}
])
const toback=()=>{
	uni.navigateBack({
		delta: 1
	})
}
</script>

<style lang="less" scoped>
	.page {
		min-height: 100vh;
		background: #5e0e03;
		.content_top{
			position: relative;
			.back{
				position: absolute;
				top: 100rpx;
				left: 50rpx;
				width: 50rpx;
				height: 50rpx;
				font-size: 30rpx;
				color: #fff;
				z-index: 101;
			}
			.logo{
				height: 900rpx;
				width: 100%;
			}
			}
			
		.content2{
			position: relative;
			height: 800rpx;
			.datalist{
				position: absolute;
				top: -150rpx;
				width: 90%;
				height: 760rpx;
				margin: 0 5%;
				background:url('https://buma-1307931616.cos.ap-guangzhou.myqcloud.com/xian/static/indexpage/yxcontent.png');
				background-repeat: no-repeat;
				background-size: contain;
				z-index: 99;
				// image{
				// 	width: 100%;
				// 	height: 800rpx;
				// }
				.scrollView{
					position: relative;
					z-index: 101;
					padding: 10rpx 5%;
					width: 90%;
					.imglist{
						margin-top: 130rpx;
						display: flex;
						.img{
							width:180rpx;
							height:700rpx;
							margin-right: 15rpx;
							image{
								width: 180rpx;
								height: 500rpx;
							}
						}
					}
				}
			}
			.moreimg{
				position: absolute;
				bottom: 120rpx;
				right: 40rpx;
				image{
					width: 48rpx;
					height: 43rpx;
					display: inline-block;
					margin-right: 20rpx;
				}
				text{
					position: relative;
					top: -15rpx;
					color: #ffc508;
					font-size: 32rpx;
					line-height: 90rpx;
					display: inline-block;
				}
			}
			
		}
		.nomore{
			position: relative;
			bottom:0rpx ;
			text-align: center;
			width: 100%;
			z-index: 1;
			height:100rpx;
			.position_re{
				width: 100%;
				position: absolute;
				bottom:30rpx ;
			}
		 
		}
	}

	
</style>